<template>
	<div class="page-home">
		<div class="w-chart-wrapper">
			<WarningChar :data="chartData" />
		</div>
		
	</div>
</template>
<script>
import WarningChar from '@/components/warning-chart'

export default {
	components: {
		WarningChar
	},
	data() {
		return {
			chartData: {
				one: 82,
				two: 100,
				three: 66
			}
		};
	},
	mounted(){
		setTimeout(()=>{
			this.dataChangeTest()
		})
	},
	methods: {
		dataChangeTest(){
            setInterval(() => {
                this.chartData.one = parseInt(Math.random()*100)
                this.chartData.two = parseInt(Math.random()*100)
                this.chartData.three = parseInt(Math.random()*100)
            }, 1600);
        }
	}
};
</script>
<style lang="scss" scoped>
.w-chart-wrapper{
	width: 500px;
	margin: auto;
}
.page-home{
	padding-top: 50px;
}
</style>
